<template>
	<view class="buying">
		<view class="nav">
			<image src="http://q79q98ocd.bkt.clouddn.com/back.png" @click="toPro()" class="backs"></image>
			求购大厅
			<image src="http://q79q98ocd.bkt.clouddn.com/list.png" class="list" @click="toScreen()"></image>
		</view>
		<view class="buyList" v-for="(item,index) in buyList">
			<view class="buyOne">{{item.one}}</view>
			<view class="buyTwo"><text>{{item.two}}</text><text>{{item.twos}}</text></view>
			<view class="buyThree">{{item.three}}</view>
			<view class="buyThree">{{item.threes}}</view>
			<view class="buyFour">{{item.four}}<text  @click="getUrl(item.url)">{{item.fours}}</text></view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
			 buyList:[
				 {one: '纯正有机娃娃菜',two: '天然有机',twos: '水栽培',three: '指定产地：山东',threes: '补充说明：好吃就是香',four: '30000斤',fours: '报价',url: 'offer'},
				  {one: '纯正有机娃娃菜',two: '天然有机',twos: '水栽培',three: '指定产地：山东',threes: '补充说明：好吃就是香',four: '30000斤',fours: '报价'},
				   {one: '纯正有机娃娃菜',two: '天然有机',twos: '水栽培',three: '指定产地：山东',threes: '补充说明：好吃就是香',four: '30000斤',fours: '报价'}
			 ]	
			};
		},
		methods: {
			getUrl(url){
				console.log(url);
				uni.navigateTo({
					url:url
				})
			},
			toPro(){
				uni.reLaunch({
					url: '../products'
				});
			},
			toScreen(){
				uni.navigateTo({
					url:'screen'
				})
			}
			
		},
		
	}
</script>

<style lang="scss">
.buying{
	color: #666;
	.nav{
		padding: 70upx 0 10upx 0;
		text-align: center;
		position: relative;
		border-bottom: #F00;
		font-size:36upx;
		font-weight:500;
		color: #333;
		.backs{
			width: 35upx;
			height: 35upx;
			vertical-align: middle;
			position: absolute;
			left: 30upx;
			bottom: 16.5upx;
		}
		.list{
			width: 35upx;
			height: 35upx;
			vertical-align: middle;
			position: absolute;
			right: 30upx;
			bottom: 16.5upx;
		}
	}
	.buyList{
		padding: 30upx;
		line-height: 50upx;
		
		.buOne{
			font-size: 32upx;
			font-weight: 500;
			color: #333;
		}
		.buyTwo{
			text{
				border: 1upx solid #F74C18;
				font-size: 20upx;
				color: #F74C18;
				margin-right: 15upx;
				border-radius: 5upx;
				padding: 0 5upx;
			}
		}
		.buyThree{
			font-size: 28upx;
		}
		.buyFour{
			font-size: 32upx;
			color: #F40E0E;
			text{
				float: right;
				background-color: #55C47D;
				border-radius: 5upx;
				font-size: 32upx;
				color: #fff;
				padding: 8upx 22upx;
			}
		}
	}
}
</style>
